<template>
    <div>
        <div class="ball"  >
           <i class="el-icon-error"></i>
        </div>
        <p>付款失败</p>
        <section v-for="item in list" :key="item.id">订单编号: {{item.listing}}</section>
        <div class="fails">
            <strong>立即支付</strong>
        </div>
    </div>
</template>

<script>
    export default {
        data(){
            return{
                list:[
                    {
                        listing:"2019091929990"
                    }
                ]
            }
        },
        methods:{
            me(){
                this.$router.push("/nonuse")
            }
        }
    }
</script>

<style scoped>
.ball{
    width: 100vw;
    height: 10vh;
    /* background: #fff; */
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 50px;
}
.ball i{
    font-size: 80px;
    color: #f2f2f2;
}
p{
font-size: 20px;
text-align: center;
margin-top: 20px;
}
section{
font-size: 14px;
color: #666;
text-align: center;
margin-top: 30px;
}
.fails{
    width: 80vw;
    height: 8vh;
    background: #409EFF;
    color: #fff;
    font-size: 24px;
    text-align: center;
    line-height: 50px;
    border-radius: 50px;
    margin-left: 40px;
    margin-top: 80px;

}
.tiaozhuan{
    position: absolute;
    color: plum;
    font-size: 28px;
    top: 3vh;
    left: 2vw;
    /* bottom: 5vh; */
}
</style>
<style>
body{
    background: #fff;
}
</style>